// 判断用户是否登录--判断cookie中会否存在username的值
$(function() {
    // 获取cookie的username，如果cookie中的username有值，则表示用户已经登录，否则未登录
    var username = getCookie('username');
    var login = document.querySelector('.login');
    var login2 = document.querySelector('.login2');
    if (username) {
        // 用户已经登录，在顶部导航栏，显示用户的信息，及显示退出按钮
        var str = `
        <li><a href="">欢太商城APP</a></li>
        <li><a href="javascript:;"><i class="iconfont icon-yonghu"></i><span>${username}</span>
            </a></li>
            <li><a href="javascript:;" class="logout1">退出</a></li>
        <li><a href="../html/cart.html"><i class="iconfont icon-gouwuchekong"></i><span>购物车</span><span class="qwe">(0)</span></a></li>
        `;
        login.innerHTML = str;
        var str1 = `
        <a href="javascript:;">欢迎，${username}</a>
        <a href="javascript:;" class="logout">退出</a>
        `;
        login2.innerHTML = str1;
        // 退出功能,点击退出
        var logout = document.querySelector('.logout');
        var logout1 = document.querySelector('.logout1');
        logout.onclick = function() {
            // 使用layer的confirm弹出层，展示 确定 和 取消 的选项
            layer.confirm('你确定要退出吗？', { btn: ['确定', '取消'] },
                // 第一个 确定 按钮点击触发的函数
                function() {
                    // 删除cookie，退出登录状态
                    delCookie('username');
                    login.innerHTML = ` <li><a href="">欢太商城APP</a></li>
                    <li><a href="./login.html"><i class="iconfont icon-yonghu"></i><span>登录</span>
                        </a></li>
                    <li><a href="./register.html">注册</a></li>
                    <li><a href="../html/cart.html"><i class="iconfont icon-gouwuchekong"></i><span>购物车</span><span>(0)</span></a></li>`;
                    login2.innerHTML = ` <a href="../html/login.html">登录 |</a>
                    <a href="../html/register.html">注册</a>`
                    layer.msg('退出成功', { icon: 1, time: 500 })
                },
                // 第二个 取消 按钮 点击触发的函数
                function() {
                    layer.msg('已取消', { icon: 1, time: 500 })
                    return false;
                }
            )
        }
        logout1.onclick = function() {
            // 使用layer的confirm弹出层，展示 确定 和 取消 的选项
            layer.confirm('你确定要退出吗？', { btn: ['确定', '取消'] },
                // 第一个 确定 按钮点击触发的函数
                function() {
                    // 删除cookie，退出登录状态
                    delCookie('username');
                    login.innerHTML = ` <li><a href="">欢太商城APP</a></li>
                    <li><a href="./login.html"><i class="iconfont icon-yonghu"></i><span>登录</span>
                        </a></li>
                    <li><a href="./register.html">注册</a></li>
                    <li><a href="../html/cart.html"><i class="iconfont icon-gouwuchekong"></i><span>购物车</span><span>(0)</span></a></li>`;
                    login2.innerHTML = ` <a href="../html/login.html">登录 |</a>
                    <a href="../html/register.html">注册</a>`
                    layer.msg('退出成功', { icon: 1, time: 500 })
                },
                // 第二个 取消 按钮 点击触发的函数
                function() {
                    layer.msg('已取消', { icon: 1, time: 500 })
                    return false;
                }
            )
        }
    }
})